// 使用组件
Vue.component("greeting", {
    // 模板,注意，在模板里面只能有一个根标签
    template: ` 
    <p>
    {{name}} : 大家好， 给大家介绍一下我的女朋友 @关晓彤 
    <button v-on:click="changeName">改名</button>
    </p>`,
    data: function() {
        return {
            name: "鹿晗"
        }
    },
    methods: {
        changeName: function() {
            this.name = "henry";
        }
    }
});
Vue.component("hello", {
    template: " <p>{{name}}你好呀,我是模板</p>",
    data: function() {
        return {
            name: "bar"
        }
    }
});




new Vue({
    el: "#vue-app-one"
});
new Vue({
    el: "#vue-app-two"
});